<template>
   <!-- 无子级 -->
   <el-menu-item :index="basePath" v-if="!item.children || item.children.length <= 0">
      <el-icon>
         <component :is=initIcon(item.icon)></component>
      </el-icon>
      <span>{{ item.menuText }}</span>
   </el-menu-item>
   <!-- 有子级 -->
   <el-sub-menu :index="basePath" v-else>
      <template #title>
         <el-icon>
            <component :is=initIcon(item.icon)></component>
         </el-icon>
         <span>{{ item.menuText }}</span>
      </template>
      <NavItem v-for="sub in item.children" :key="sub.webUrl" :item="sub" :basePath="sub.webUrl" />
   </el-sub-menu>
</template>

<script setup>
import { ref, reactive } from 'vue'
import { initIcon } from '../../common/index'


const { item, basePath } = defineProps({
   item: {
      type: Object,
   },
   basePath: {
      type: String
   }
})




</script>